import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import { Button, Icon, Drawer, Layout } from 'antd';
import SearchIndex from './search/search';
const { generateTheme } = require('antd-theme-generator');
const {
  Header, Footer, Sider, Content,
} = Layout;


class App extends Component {
  state = { visibleSrtting: false ,visibleBack:false};

  constructor(props: any) {
    super(props);
    Icon.setTwoToneColor('#1DA57A');
  }

  showDrawer = () => {
    this.setState({
      visibleSrtting: true,
    });
  };

  showDrawerBack = () =>{
    this.setState({
      visibleBack: true,
    });
  }

  onClose = () => {
    this.setState({
      visibleSrtting: false,
    });
  };

  onCloseBack = () => {
    this.setState({
      visibleBack: false,
    });
  };

  render() {
    return (
      <div className="App">
        <Layout>
          <Content className="content">
            <Icon className="setting" type="setting" style={{ fontSize: '22px' }} theme="twoTone" onClick={this.showDrawer} />
            <Icon className="skin" type="skin" style={{ fontSize: '22px' }} theme="twoTone" onClick={this.showDrawerBack} />
            <SearchIndex />
            <Drawer
              title="设置和说明"
              placement="right"
              closable={false}
              onClose={this.onClose}
              visible={this.state.visibleSrtting}
            >
              <p>本页面由孤狼开发，提供网址导航功能，谷歌搜索需要VPN连接，本站不提供任何VPN服务。</p>
              <p>感谢大家的喜欢和设置本站为默认主页！🤩</p>
              <p>爱你们三千遍🛡</p>
            </Drawer>
            <Drawer
              title="更换背景"
              placement="right"
              closable={false}
              onClose={this.onCloseBack}
              visible={this.state.visibleBack}
            >
              <p>开发中，尽情期待！🏄🏄🏄</p>

            </Drawer>
          </Content>

          {/* <Footer style={{ textAlign: 'center' }}>
            Ant Design ©2018 Created by Ant UED
          </Footer> */}
        </Layout>
      </div>
    );
  }
}

export default App;
